import { customRef } from "vue";
// 自定义ref的基本结构
/*
export function numberRef(initValue) {
  return customRef((track, trigger) => {
    return {
      get() {

      },
      set(newValue) {
        
      }
    }
  })
}
*/

// 需求：自定义一个只能保存number类型的ref。
// const num1 = numberRef(10);
export function numberRef(initValue) {
  return customRef((track, trigger) => {
    return {
      get() {
        if (typeof initValue == "number") {
          console.log("执行了get方法");
          track(); // 追踪initValue值得变化
          return initValue;
        } else {
          throw new Error("只能声明number类型得数据");
        }
      },
      set(newValue) {
        if (typeof newValue == "number") {
          console.log("执行了set方法");
          initValue = newValue;
          trigger(); // 渲染新值
        } else {
          throw new Error("只能声明number类型得数据");
        }
      },
    };
  });
}

// 需求：通过这个ref声明得数据，在保存新数据得时候，加入了防抖得功能。
export function useDebouncedRef(value, delay = 200) {
  let timeout;
  return customRef((track, trigger) => {
    return {
      get() {
        track();
        return value;
      },
      set(newValue) {
        clearTimeout(timeout);
        timeout = setTimeout(() => {
          value = newValue;
          trigger();
        }, delay);
      },
    };
  });
}
